export const eventTypes = {
  DOMLOAD: 'domLoad',
  FIELDVALUECHANGE: 'fieldValueChange',
  SETFIELDVALUE: 'setFieldValue',
  GETFIELDVALUE: 'getFieldValue',
  GETURLPARAMVALUE: 'getUrlParamValue',
  ONSUBMIT: 'onSubmit'
}

const { DOMLOAD, FIELDVALUECHANGE, SETFIELDVALUE, GETFIELDVALUE, GETURLPARAMVALUE, ONSUBMIT} = eventTypes;

export const events = [
  {
    title: '基础',
    content:[
      {
        id: SETFIELDVALUE,
        sign: 'EdcForm.setFieldValue()',
        desc: '使用此方法设置表单字段的值',
        example: 'EdcForm.setFieldValue(fieldidOrIndex, value)'
      },
      {
        id: GETFIELDVALUE,
        sign: 'EdcForm.getFieldValue()',
        desc: '使用此方法获取表单字段的值',
        example: 'EdcForm.getFieldValue(fieldidOrIndex)'
      },
      {
        id: GETURLPARAMVALUE,
        sign: 'EdcForm.getUrlParamValue()',
        desc: '使用此方法获取url的参数值',
        example: 'EdcForm.getUrlParamValue()'
      }
    ]
  },
  {
    title: '事件',
    content: [
      {
        sign: 'bindEvent',
        desc: '绑定事件方法',
        children: [
          {
            sign: 'domLoad',
            desc: '监听页面加载完成后执行该事件的回调',
            id: DOMLOAD
          },
          {
            sign: 'fieldValueChange',
            desc: '监听表单字段的值改变后的回调',
            id: FIELDVALUECHANGE
          },
          {
            sign: 'onSubmit',
            desc: '监听表单提交后的回调',
            id: ONSUBMIT
          }
        ]
      }
    ]
  }
];

export const snippets = [
  {
    example: (`<div>
                /* 根据字段id设置字段值 */ <br /> 
                /* 如果是明细子表，设置值为二维数组[['12','123']] */ <br />
                /* 如果设置明细子表多行值，设置值为[['12', '123'],['12','123']]<br />
                EdcForm.setFieldValue("d3e253f9a7504d30ad153ecbaf909f64", "123"); <br /> 
                </div>`),
    id: SETFIELDVALUE,
    template: '',
    noteTitle: "设置属性值",
    snippet: 'EdcForm.setFieldValue("::focus", "");',
    snippetFace: SETFIELDVALUE,
    noteContent: (`<div class="ace-note-main">
                    <div class="ace-note- p">使用此方法设置表单字段的值</div>
                    <div class="ace-note-p">
                      EdcForm.setFieldValue(fieldid, value);
                    </div>
                    <div class="ace-note-p" style="margin-bottom: 3px;">
                      <strong>参数：</strong>
                    </div>
                    <div class="ace-note-param">
                      <div class="param-name">
                        <span><strong>fieldid</strong></span>
                        <span>String</span><span>[ 必需 ]</span>
                      </div>
                      <div class="param-text">字段id</div>
                    </div>
                    <div class="ace-note-param">
                      <div class="param-name">
                        <span><strong>value</strong></span>
                        <span>String</span><span>[ 必需 ]</span>
                      </div>
                      <div class="param-text">字段值</div>
                    </div>
                    <div class="ace-note-p"><strong>返回值：</strong>无</div>
                  </div>`),
  },
  {
    example: (`<div>
                /* 根据字段id获取字段值 */ <br /> EdcForm.getFieldValue("d3e253f9a7504d30ad153ecbaf909f64"); <br />
             </div>`),
    id: GETFIELDVALUE,
    template: '',
    noteTitle: "获取属性值",
    snippet: 'EdcForm.getFieldValue("::focus");',
	snippetFace: GETFIELDVALUE,
	noteContent: (`<div class="ace-note-main">
                    <div class="ace-note-p">使用此方法获取表单字段的值</div>
                    <div class="ace-note-p">
                      EdcForm.getFieldValue(fieldid);
                    </div>
                    <div class="ace-note-p" style="margin-bottom: 3px;">
                      <strong>参数：</strong>
                    </div>
                    <div class="ace-note-param">
                      <div class="param-name">
                        <span><strong>fieldid</strong></span>
                        <span>String</span><span>[ 必需 ]</span>
                      </div>
                      <div class="param-text">字段id</div>
                    </div>
                    <div class="ace-note-p"><strong>返回值：</strong>字段值</div>
                  </div>`)
  },
  {
	example: (`<div>
				/* 获取url中的参数值 */ <br /> EdcForm.getUrlParamValue(key); <br />
			</div>`),
	id: GETURLPARAMVALUE,
	template: '',
	noteTitle: '获取url中的参数值',
	snippet: 'EdcForm.getUrlParamValue("::focus");',
	snippetFace: GETURLPARAMVALUE,
  	noteContent: (`<div class="ace-note-main">
				  	<div class="ace-note-p">使用此方法获取url中的参数值</div>
                    <div class="ace-note-p">
                      EdcForm.getUrlParamValue(key);
                    </div>
                    <div class="ace-note-p" style="margin-bottom: 3px;">
                      <strong>参数：</strong>
                    </div>
                    <div class="ace-note-param">
					  <div class="param-name">
					 	<span><strong>key</strong></span>
                      	<span>String</span><span>[ 必需 ]</span> 
					  </div>
					  <div class="param-text">参数名称</div>
                    </div>
                    <div class="ace-note-p"><strong>返回值：</strong>参数值</div>
                  </div>`)
  },
  {
    id: DOMLOAD,
    template: '',
    noteTitle: "绑定页面加载完成后事件",
    snippet: 'EdcForm.bindEvent("domLoad", function(){\n    ::focus \n});',
    snippetFace: DOMLOAD,
    example: (`<div>
                EdcForm.bindEvent("domLoad", function(){ <br />&nbsp;&nbsp;&nbsp;&nbsp;/* 执行页面加载完成后的回调操作 */ <br />&nbsp;&nbsp;&nbsp;&nbsp;console.log("page loaded.");<br />});
              </div>`),
    noteContent: (`<div class="ace-note-main">
                    <div class="ace-note-p">使用此方法在页面加载完成后执行该事件的回调</div>
                    <div class="ace-note-p">
                      bindEvent("domload", handler);
                    </div>
                    <div class="ace-note-p" style="margin-bottom: 3px;">
                      <strong>参数：</strong>
                    </div>
                     <div class="ace-note-param">
                      <div class="param-name">
                        <span><strong>handler</strong></span>
                        <span>Function</span><span>[ 必需 ]</span>
                      </div>
                      <div class="param-text">回调方法</div>
                    </div>
                    <div class="ace-note-p"><strong>返回值：</strong>无</div>
                  </div>`)
  },
  {
    example: (`<div>
                EdcForm.bindEvent("fieldValueChange", "d3e253f9a7504d30ad153ecbaf909f64", function(fieldId, value){
                  <br />&nbsp;&nbsp;&nbsp;&nbsp;/* 返回值包含 fieldId 和value */
                  <br />
                });
              </div>`),
    id: FIELDVALUECHANGE,
    noteTitle: "绑定属性值改变事件",
    template: 'EdcForm.bindEvent(FIELDVALUECHANGE, [""], function(){});',
    snippet: 'EdcForm.bindEvent("fieldValueChange", "", function(){\n    ::focus \n});',
    snippetFace: FIELDVALUECHANGE,
    noteContent: (`<div class="ace-note-main">
                    <div class="ace-note-p">使用此方法改变表单属性的值</div>
                    <div class="ace-note-p">
                      bindEvent("filedvaluechange", fieldid, handler)
                    </div>
                    <div class="ace-note-p" style="margin-bottom: 3px;">
                      <strong>参数：</strong>
                    </div>
                    <div class="ace-note-param">
                      <div class="param-name">
                        <span><strong>fieldids</strong></span>
                        <span>String</span><span>[ 必需 ]</span>
                      </div>
                      <div class="param-text">要监听的元素id</div>
                    </div>
                     <div class="ace-note-param">
                      <div class="param-name">
                        <span><strong>handler</strong></span>
                        <span>Function</span><span>[ 必需 ]</span>
                      </div>
                      <div class="param-text">回调方法</div>
                    </div>
                    <div class="ace-note-p"><strong>返回值：</strong>无</div>
                  </div>`)
  },
  {
    example: (`<div>
                EdcForm.bindEvent("onSubmit", function(dataId){
                  <br />
                  &nbsp;&nbsp;&nbsp;&nbsp;/*表单提交后执行的回调操作*/
                  <br />
                  &nbsp;&nbsp;&nbsp;&nbsp;console.log("表单提交后回调");
                  <br />
                });
              </div>`),
    id: ONSUBMIT,
    noteTitle: "绑定表单提交后事件",
    template: 'EdcForm.onSubmit(ONSUBMIT, function(){});',
    snippet: 'EdcForm.bindEvent("onSubmit", function(){\n    ::focus \n});',
    snippetFace: ONSUBMIT,
    noteContent: (`<div class="ace-note-main">
                    <div class="ace-note-p">使用此方法在表单提交后执行该事件的回调</div>
                    <div class="ace-note-p">
                      bindEvent("onSubmit", handler);
                    </div>
                    <div class="ace-note-p" style="margin-bottom: 3px;">
                      <strong>参数：</strong>
                    </div>
                     <div class="ace-note-param">
                      <div class="param-name">
                        <span><strong>handler</strong></span>
                        <span>Function</span><span>[ 必需 ]</span>
                      </div>
                      <div class="param-text">回调方法</div>
                    </div>
                    <div class="ace-note-p"><strong>返回值：</strong>无</div>
                  </div>`)
  }
];
